﻿Highcharts.theme = {
     chart: {
        backgroundColor: '#EEEEEE',
        borderWidth: 0,
        //borderColor: '#090909',
        borderRadius: 0,

        plotBackgroundColor: null,
        plotShadow: false,
        plotBorderWidth: 0,
        marginTop:10,
        marginBottom:30,
        shadow: false
    },
    lang: {
        months: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一', '十二']//,rangeSelectorZoom:'-'
    },
    colors: ['#F9AB00', '#3675BC', '#E71A21', '#2078B2', '#E2C107', '#89A54E', '#80699B', '#3D96AE', '#DB843D', '#92A8CD', '#A47D7C', '#B5CA92'],
    exporting: { enabled: false },
    rangeSelector: { enabled: false },
    navigation: { buttonOptions: { enabled: false } },
    navigator: { enabled: false },
    scrollbar: { enabled: false },
    credits: { enabled: false },
    title: {
        text: null,
        style: {
            color: '#FFF',
            fontSize: '14px'
        }
    },
    credits: {enabled: false},
    subtitle: { enabled: false
        //,style: {
        //    color: '#DDD',
        //    font: '12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
        //}
    },
    legend: {
        enabled: false,
        borderWidth: 0,
        symbolWidth: 40,
        itemWidth: 112,
        itemStyle: {
            color: '#666'
        },
        itemHoverStyle: {
            color: '#666'
        },
        itemHiddenStyle: {
            color: '#666'
        },
		 labelFormatter: function() {
               
				//$.each(this.items, function(i, item) {
               //    return '<span style="color:'+this.color+'">'+ this.name +'</span>';
				   return '<span>'+ this.name +'</span>';
              //  });
            }
    },
    tooltip: {
        shared:false,
        backgroundColor: {
            linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
            stops: [[0, 'rgba(60,60,60,0.80)'], [1, 'rgba(20,20,20,0.80)']]
        },
        borderColor: '#666',
        borderWidth: 1,
        style: {
            color: '#FFF'
        },
        formatter: function ()
        {
            var si0 = '<span>' + Highcharts.dateFormat('%Y年%m月%d日', this.x) + '</span>';
			var si = ""
			var pVal = [];
            $.each(this.points, function (i, point)
            {	
				if (i==0){pVal[0] = point.y}else{pVal[1] = point.y}	
				if (pVal[0] < pVal[1]){			
					si = '<br/><span style="color:' + this.series.color + '" >' + this.series.name + '</span>:' + (point.y).toFixed(2) + ' %' + si;
				}else{
					si += '<br/><span style="color:' + this.series.color + '" >' + this.series.name + '</span>:' + (point.y).toFixed(2) + ' %';
					}
            });
            return si0 +""+ si;
        }
    },
    yAxis: {
        alternateGridColor: null,
        minorTickInterval: null,
		tickPixelInterval:30,
		startOnTick:true,
		endOnTick: true,
		showFirstLabel: true,
	    showLastLabel: true,
       	gridLineColor: 'rgba(255, 255, 255, .1)',
        lineWidth: 1,
        lineColor: "#333",
        tickWidth: 0.05,
		tickColor: 'rgba(255, 255, 255, .1)',
	    //plotBands: [{
	    //		//from: -100,
	    //		//to: 100,
	    //		//color: '#000000'
	    //	}],
		labels: {
            align: 'right',
            x: -10,
            y: 6,
            style: {
                color: '#aaa'
            },
        formatter: function (){
                var showValue = this.value;
                showValue = showValue.toFixed(2);
                if (showValue == 0)
                {
                    return '<span style="">' + showValue + '%</span>';
                } else if (showValue > 0)
                {
                    return '<span style="color:#FF5E5C;">' + showValue + '%</span>';
                } else
                {
                    return '<span style="color:#02FF62;">' + showValue + '%</span>';
                }
            }
        },
        title: {
            style: {
                color: '#AAA',
                font: 'bold 12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
            }
        }
    },
    xAxis: {
        lineWidth: 1,
        lineColor: "#333",
        tickColor: '#333',
		tickWidth:0,
        gridLineWidth: 0,
        type: 'datetime',
        dateTimeLabelFormats: {
            second: ' ',
            minute: ' ',
            hour: ' ',
            day: '%Y-%m-%d',
            week: '%Y-%m-%d',
            month: '%Y年%m月',
            year: '%Y'
        },
        labels: {
            style: {
                color: '#787878'
            }
        },
        title: {
            style: {
                color: '#AAA',
                font: 'bold 12px Lucida Grande, Lucida Sans Unicode, Verdana, Arial, Helvetica, sans-serif'
            }        
        }
    },
   labels: {
        style: {
            color: '#666'
        }
    },
   plotOptions: {
       series: {
            type: 'line',
            lineWidth:2,
            dataLabels: {
                color: '#CCC',
                connectorColor: '#CCC'
            },
            animation: false,
            gapSize: 0,
            states: {
                hover: {
                    lineWidth: 1
                }
            },
            marker: {
                enabled: true,
                symbol: 'circle',
                lineWidth: 1,
                radius:3,
                states: {
                    hover: {
                        enabled: false,
                        lineWidth: 0,
                        radius: 4
                    }
                }
            },
            events: {
                legendItemClick: false
            }
        }
    },

    // special colors for some of the demo examples
    legendBackgroundColor: 'rgba(48, 48, 48, 0.8)',
    legendBackgroundColorSolid: 'rgb(70, 70, 70)',
    dataLabelsColor: '#444',
    textColor: '#E0E0E0',
    maskColor: 'rgba(255,255,255,0.3)'
};

// Apply the theme
var highchartsOptions = Highcharts.setOptions(Highcharts.theme);